<template>
  <div>
    <table class="table table-bordered text-center table-vertical-middle table-sm">
      <colgroup>
        <col width="7%" />
        <col width="17%" />
        <col width="19%" />
        <col width="20%" />
        <col width="11%" />
        <col width="5%" />
        <col width="5%" />
        <col width="16%" />
      </colgroup>
      <tbody>
        <tr>
          <td colspan="8">
            <h3 class="m-0">分支机构及人员统计表</h3>
          </td>
        </tr>
        <tr>
          <td class="bg-light">填报人</td>
          <td colspan="2"></td>
          <td class="bg-light">联系方式</td>
          <td colspan="4"></td>
        </tr>
        <tr>
          <td class="bg-light">填报说明</td>
          <td colspan="7" class="text-left">
            <ul class="list-unstyled">
              <li>
                1、县（区）名称，必须以县、县级市、区等县级行政单位为标准填写，不要填写地级市。没有机构的县（区）请不要在此表中填写，市县级以上分支机构无论其实际业务覆盖多少个县（区），在此表中仅填报一次，“县（区）名称”填写该机构所在地的行政县（区）；
              </li>
              <li>
                2、分支机构类型中，运营中心等实际承担办事处职能的机构应归为“办事处”，挂牌机构可归为“其他机构”。
              </li>
              <li class="font-weight-bold">
                3、机构数、人员数将参与覆盖率计算，凡涉及该类数据的报表请务必保证统计口径（考核）一致。
              </li>
              <li class="font-weight-bold">
                4、农业大县网点覆盖率：以下表为基础，计算有专职人员的分支机构在农业大县的覆盖率，农业大县名单以农业农村部、财政部印发版为准，新名单未印发前，暂不需填写。
              </li>
            </ul>
          </td>
        </tr>
        <tr>
          <td class="bg-light">农业大县网点覆盖率</td>
          <td colspan="7"></td>
        </tr>
        <tr class="bg-light">
          <td>序号</td>
          <td>分支机构所在县（区）名称</td>
          <td>分支机构层级（县级以上机构/县级及以下机构）</td>
          <td>分支机构类型（分公司，子公司，办事处，其他机构）</td>
          <td>分支机构中是否有专职人员（是/否）</td>
          <td>专职人员数</td>
          <td>兼职人员数</td>
          <td>该县（区）所属地级市名称</td>
        </tr>
        <tr v-for="(data, index) of tableData" :key="index">
          <td>{{ data.mockIndex }}</td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
export default {
  components: {},
  props: {
    visible: Boolean,
  },
  data() {
    return {
      tableData: [],
    }
  },
  computed: {},
  watch: {},
  created() {
    this.getData()
  },
  mounted() {},
  methods: {
    getData() {
      for (let i = 0; i < 10; i++) {
        this.tableData.push({
          mockIndex: i + 1,
        })
      }
    },
  },
}
</script>

<style lang="scss" scoped></style>
